<template>
  <custom-modal-page :visible.sync="visible">
    <div class="beaminfo-config-container" v-loading="pageLoading">
      <div class="beaminfo-config-body">
        <div class="beaminfo-header">
          {{ getTitle(type) }}
          <a-button type="primary" ghost class="back-button" @click="goBack()">
            返回
          </a-button>
        </div>
        <div class="beaminfo-content">
          <a-form-model ref="ruleForm" :model="form" :rules="rules">
            <custom-collapse :activeKey="activeKey" :panelList="panelList">
              <!-- 基础信息 -->
              <template slot="space_1">
                <a-row>
                  <!-- 梁号 -->
                  <a-col v-bind="span_1">
                    <a-form-model-item
                      ref="componentParts"
                      label="梁号"
                      prop="componentParts"
                      :rules="{
                        required: !form.componentPartsDisable,
                        message: '请输入梁号',
                      }"
                    >
                      <a-input
                        allowClear
                        :disabled="form.componentPartsDisable"
                        v-model="form.componentParts"
                        placeholder="请输入梁号"
                      />
                    </a-form-model-item>
                  </a-col>
                  <!-- 所属桥梁 -->
                  <a-col v-bind="span_2">
                    <a-form-model-item
                      ref="bridgeName"
                      label="所属桥梁"
                      prop="bridgeName"
                      :rules="{
                        required: !form.bridgeNameDisable,
                        message: '请选择桥梁',
                      }"
                    >
                      <a-select
                        allowClear
                        :disabled="form.bridgeNameDisable"
                        v-model="form.bridgeName"
                        :loading="bridgeNameLoading"
                        placeholder="请选择所属桥梁"
                      >
                        <a-select-option
                          :value="item"
                          v-for="(item, index) in form.bridgeNameSource"
                          :key="index"
                        >
                          {{ item }}
                        </a-select-option>
                      </a-select>
                    </a-form-model-item>
                  </a-col>
                  <!-- 一联一跨 -->
                  <a-col v-bind="span_3" class="unionspan-col-item">
                    <a-form-model-item
                      label="一联一跨"
                      prop="unionspan"
                      :rules="{
                        required: !form.uniteDisable && !form.spanDisable,
                        validator: validateUnionspan,
                      }"
                    >
                      <div class="unionspan-container flex">
                        <div class="flex">
                          <span>第</span>
                          <a-input
                            type="number"
                            placeholder="联"
                            v-model="form.unite"
                            :disabled="form.uniteDisable"
                          />
                          <span>联</span>
                        </div>
                        <div class="flex">
                          <span>第</span>
                          <a-input
                            type="number"
                            placeholder="跨"
                            v-model="form.span"
                            :disabled="form.spanDisable"
                          />
                          <span>跨</span>
                        </div>
                      </div>
                    </a-form-model-item>
                  </a-col>
                  <!-- 幅别 -->
                  <a-col v-bind="span_3">
                    <a-form-model-item
                      ref="amClass"
                      label="幅别"
                      prop="amClass"
                      :rules="{
                        required: !form.amClassDisable,
                        message: '请选幅别',
                      }"
                    >
                      <a-select
                        allowClear
                        v-model="form.amClass"
                        placeholder="请选择幅别"
                        :disabled="form.amClassDisable"
                      >
                        <a-select-option value="左幅"> 左幅 </a-select-option>
                        <a-select-option value="右幅"> 右幅 </a-select-option>
                      </a-select>
                    </a-form-model-item>
                  </a-col>
                  <!-- 长度 -->
                  <a-col v-bind="span_3">
                    <a-form-model-item
                      ref="beamLength"
                      label="长度(m)"
                      prop="beamLength"
                      :rules="{
                        required: !form.beamLengthDisable,
                        message: '请输入长度',
                      }"
                    >
                      <a-input
                        allowClear
                        :disabled="form.beamLengthDisable"
                        v-model="form.beamLength"
                        placeholder="请输入长度"
                        type="number"
                      />
                    </a-form-model-item>
                  </a-col>
                  <!-- 梁类型 -->
                  <a-col v-bind="span_3">
                    <a-form-model-item
                      ref="beamType"
                      label="梁类型"
                      prop="beamType"
                      :rules="{
                        required: !form.beamTypeDisable,
                        message: '请选择梁类型',
                      }"
                    >
                      <a-select
                        :loading="beamTypeLoading"
                        allowClear
                        :disabled="form.beamTypeDisable"
                        v-model="form.beamType"
                        placeholder="请选择梁类型"
                      >
                        <a-select-option
                          :value="item.dicValue"
                          v-for="(item, index) in form.beamTypeSource"
                          :key="index"
                        >
                          {{ item.dicDesc }}
                        </a-select-option>
                      </a-select>
                    </a-form-model-item>
                  </a-col>
                  <!-- 强度等级 -->
                  <a-col v-bind="span_3">
                    <a-form-model-item
                      ref="strengthGrade"
                      label="强度等级"
                      prop="strengthGrade"
                    >
                      <a-select
                        allowClear
                        :disabled="form.strengthGradeDisable"
                        :loading="strengthGradeLoading"
                        v-model="form.strengthGrade"
                        placeholder="请选择强度等级"
                      >
                        <a-select-option
                          :value="item.dicValue"
                          v-for="(item, index) in form.strengthGradeSource"
                          :key="index"
                        >
                          {{ item.dicDesc }}
                        </a-select-option>
                      </a-select>
                    </a-form-model-item>
                  </a-col>
                  <!-- 设计方量 -->
                  <a-col v-bind="span_3">
                    <a-form-model-item
                      ref="designVolume"
                      label="设计方量(m³)"
                      prop="designVolume"
                    >
                      <a-input
                        allowClear
                        :disabled="form.designVolumeDisable"
                        v-model="form.designVolume"
                        type="number"
                        placeholder="请输入设计方量"
                      />
                    </a-form-model-item>
                  </a-col>
                  <!-- 坍落度 -->
                  <a-col v-bind="span_3">
                    <a-form-model-item
                      ref="slump"
                      label="坍落度(mm)"
                      prop="slump"
                    >
                      <a-input
                        allowClear
                        :disabled="form.slumpDisable"
                        v-model="form.slump"
                        type="number"
                        placeholder="请输入坍落度"
                      />
                    </a-form-model-item>
                  </a-col>
                </a-row>
              </template>

              <!-- 设计配合比 -->
              <template slot="space_2">
                <a-row>
                  <!-- 水泥 -->
                  <a-col v-bind="span_3">
                    <a-form-model-item ref="cement" label="水泥" prop="cement">
                      <a-input
                        :disabled="form.cementDisable"
                        allowClear
                        v-model="form.cement"
                        type="number"
                        placeholder="请输入水泥配合比"
                      />
                    </a-form-model-item>
                  </a-col>
                  <!-- 细骨料 -->
                  <a-col v-bind="span_3">
                    <a-form-model-item
                      ref="naturalSand"
                      label="细骨料"
                      prop="naturalSand"
                    >
                      <a-input
                        allowClear
                        :disabled="form.naturalSandDisable"
                        v-model="form.naturalSand"
                        type="number"
                        placeholder="请输入细骨料配合比"
                      />
                    </a-form-model-item>
                  </a-col>
                  <!-- 粉煤灰 -->
                  <a-col v-bind="span_3">
                    <a-form-model-item
                      ref="flyAsh"
                      label="粉煤灰"
                      prop="flyAsh"
                    >
                      <a-input
                        allowClear
                        :disabled="form.flyAshDisable"
                        v-model="form.flyAsh"
                        type="number"
                        placeholder="请输入粉煤灰配合比"
                      />
                    </a-form-model-item>
                  </a-col>
                  <!-- 水 -->
                  <a-col v-bind="span_3">
                    <a-form-model-item ref="water" label="水" prop="water">
                      <a-input
                        allowClear
                        :disabled="form.waterDisable"
                        v-model="form.water"
                        type="number"
                        placeholder="请输入水配合比"
                      />
                    </a-form-model-item>
                  </a-col>
                  <!-- 粗骨料（5-10） -->
                  <a-col v-bind="span_3">
                    <a-form-model-item
                      ref="zhongshizi"
                      label="粗骨料(5-10)mm"
                      prop="zhongshizi"
                    >
                      <a-input
                        allowClear
                        :disabled="form.zhongshiziDisable"
                        v-model="form.zhongshizi"
                        type="number"
                        placeholder="请输入粗骨料(5-10)配合比"
                      />
                    </a-form-model-item>
                  </a-col>
                  <!-- 粗骨料(10-20) -->
                  <a-col v-bind="span_3">
                    <a-form-model-item
                      ref="dashizi"
                      label="粗骨料(10-20)mm"
                      prop="dashizi"
                    >
                      <a-input
                        allowClear
                        :disabled="form.dashiziDisable"
                        v-model="form.dashizi"
                        type="number"
                        placeholder="请输入粗骨料(10-20)配合比"
                      />
                    </a-form-model-item>
                  </a-col>
                  <!-- 外加剂 -->
                  <a-col v-bind="span_3">
                    <a-form-model-item
                      ref="waterReducingAgent"
                      label="外加剂"
                      prop="waterReducingAgent"
                    >
                      <a-input
                        allowClear
                        :disabled="form.waterReducingAgentDisable"
                        v-model="form.waterReducingAgent"
                        type="number"
                        placeholder="请输入外加剂配合比"
                      />
                    </a-form-model-item>
                  </a-col>
                </a-row>
              </template>
              <!-- 钢筋信息 -->
              <template slot="space_3">
                <a-row
                  v-for="(item, index) in form.lcBeamGjInfoList"
                  :key="index"
                >
                  <!-- 强度等级 -->
                  <a-col v-bind="span_1">
                    <a-form-model-item label="钢筋型号">
                      <a-select
                        allowClear
                        :loading="rebarModeLoading"
                        v-model="form.lcBeamGjInfoList[index].model"
                        :disabled="form.lcBeamGjInfoList[index].modelDisable"
                        placeholder="请选择钢筋型号"
                      >
                        <a-select-option
                          :value="item.dicValue"
                          v-for="(item, index) in form.rebarModeSource"
                          :key="index"
                        >
                          {{ item.dicDesc }}
                        </a-select-option>
                      </a-select>
                    </a-form-model-item>
                  </a-col>
                  <!-- 钢筋直径 -->
                  <a-col v-bind="span_1">
                    <a-form-model-item label="钢筋直径(mm)">
                      <a-select
                        allowClear
                        :loading="diameterLoading"
                        v-model="form.lcBeamGjInfoList[index].rebarDiameter"
                        :disabled="
                          form.lcBeamGjInfoList[index].rebarDiameterDisable
                        "
                        placeholder="请选择钢筋直径"
                      >
                        <a-select-option
                          :value="item.dicValue"
                          v-for="(item, index) in form.diameterSource"
                          :key="index"
                        >
                          {{ item.dicDesc }}
                        </a-select-option>
                      </a-select>
                    </a-form-model-item>
                  </a-col>
                  <!-- 钢筋品种 -->
                  <a-col v-bind="span_1">
                    <a-form-model-item label="钢筋品种">
                      <a-select
                        allowClear
                        :loading="breedLoading"
                        v-model="form.lcBeamGjInfoList[index].rebarType"
                        :disabled="
                          form.lcBeamGjInfoList[index].rebarTypeDisable
                        "
                        placeholder="请选择钢筋品种"
                      >
                        <a-select-option
                          :value="item.dicValue"
                          v-for="(item, index) in form.breedSource"
                          :key="index"
                        >
                          {{ item.dicDesc }}
                        </a-select-option>
                      </a-select>
                    </a-form-model-item>
                  </a-col>
                  <!-- 数量 -->
                  <a-col v-bind="span_1" class="rebar-col-item">
                    <a-form-model-item label="数量(kg)">
                      <a-input
                        allowClear
                        v-model="form.lcBeamGjInfoList[index].gjNumber"
                        :disabled="form.lcBeamGjInfoList[index].gjNumberDisable"
                        type="number"
                        placeholder="请输入数量"
                      />
                    </a-form-model-item>
                    <!-- 操作 -->
                    <div class="operate-btn" v-if="type == 1 || type == 3">
                      <div
                        class="del"
                        @click="delRebar(index)"
                        v-if="index < form.lcBeamGjInfoList.length - 1"
                      >
                        删除
                      </div>
                      <div class="add" v-else @click="addRebar()">
                        <bj-icon-font
                          type="jiahao"
                          color="#fff"
                          :size="10"
                        ></bj-icon-font>
                      </div>
                    </div>
                  </a-col>
                </a-row>
              </template>
              <!-- 张拉钢筋信息 -->
              <template slot="space_4">
                <a-row>
                  <!-- 强度等级 -->
                  <a-col v-bind="span_1">
                    <a-form-model-item label="钢筋型号">
                      <a-select
                        allowClear
                        :loading="rebarModeLoading"
                        v-model="form.zlBeamGjInfo.model"
                        :disabled="form.zlBeamGjInfo.modelDisable"
                        placeholder="请选择钢筋型号"
                      >
                        <a-select-option
                          :value="item.dicValue"
                          v-for="(item, index) in form.rebarModeSource"
                          :key="index"
                        >
                          {{ item.dicDesc }}
                        </a-select-option>
                      </a-select>
                    </a-form-model-item>
                  </a-col>
                  <!-- 钢筋直径 -->
                  <a-col v-bind="span_1">
                    <a-form-model-item label="钢筋直径(mm)">
                      <a-select
                        allowClear
                        :loading="diameterLoading"
                        v-model="form.zlBeamGjInfo.rebarDiameter"
                        :disabled="form.zlBeamGjInfo.rebarDiameterDisable"
                        placeholder="请选择钢筋直径"
                      >
                        <a-select-option
                          :value="item.dicValue"
                          v-for="(item, index) in form.diameterSource"
                          :key="index"
                        >
                          {{ item.dicDesc }}
                        </a-select-option>
                      </a-select>
                    </a-form-model-item>
                  </a-col>
                  <!-- 钢筋品种 -->
                  <a-col v-bind="span_1">
                    <a-form-model-item label="钢筋品种">
                      <a-select
                        allowClear
                        :loading="breedLoading"
                        v-model="form.zlBeamGjInfo.rebarType"
                        :disabled="form.zlBeamGjInfo.rebarTypeDisable"
                        placeholder="请选择钢筋品种"
                      >
                        <a-select-option
                          :value="item.dicValue"
                          v-for="(item, index) in form.breedSource"
                          :key="index"
                        >
                          {{ item.dicDesc }}
                        </a-select-option>
                      </a-select>
                    </a-form-model-item>
                  </a-col>
                  <!-- 数量 -->
                  <a-col v-bind="span_1" class="rebar-col-item">
                    <a-form-model-item label="数量(kg)">
                      <a-input
                        allowClear
                        v-model="form.zlBeamGjInfo.gjNumber"
                        :disabled="form.zlBeamGjInfo.gjNumberDisable"
                        type="number"
                        placeholder="请输入数量"
                      />
                    </a-form-model-item>
                  </a-col>
                </a-row>
              </template>
            </custom-collapse>
          </a-form-model>
        </div>
        <div class="beaminfo-footer">
          <a-button @click="goBack()">取消</a-button>
          <a-button type="primary" @click="onSubmit" :loading="submitLoading">
            确定
          </a-button>
        </div>
      </div>
    </div>
  </custom-modal-page>
</template>
<script>
import fromMixin from "./form";
import { getBridgeList, getDetail } from "@/api/wisdom-beam/beamInfoConfig";
import { getDickeyList } from "@/api/common";
export default {
  props: {
    visible: {
      type: Boolean,
      default: false,
    },
    type: {
      type: [String, Number],
      default: "1",
    },
    row: {
      type: Object,
      default: () => {
        return {};
      },
    },
  },
  mixins: [fromMixin],
  data() {
    return {
      pageLoading: false,
      rebarModeLoading: false,
      diameterLoading: false,
      breedLoading: false,
      strengthGradeLoading: false,
      beamTypeLoading: false,
      bridgeNameLoading: false,
      submitLoading: false,
      //折叠面板
      activeKey: ["1", "2", "3", "4"],
      panelList: [
        {
          key: "1",
          header: "基础信息",
        },
        {
          key: "2",
          header: "设计配合比（单位：kg/m³）",
        },
        {
          key: "3",
          header: "钢筋信息",
        },
        {
          key: "4",
          header: "张拉钢筋信息",
        },
      ],
    };
  },
  watch: {
    visible: {
      handler(val) {
        if (val) {
          this.getBridgeList();
          this.getBeamType();
          this.getStrength();
          this.getRebarMode();
          this.getDiameter();
          this.getBreed();
          this.checkFormDisabled();
          if (this.type != 1) {
            this.initData();
          } else {
            this.form.lcBeamGjInfoList = [
              {
                //型号
                model: undefined,
                //直径
                rebarDiameter: undefined,
                //品种
                rebarType: undefined,
                //数量
                gjNumber: "",
              },
            ];
            this.form.zlBeamGjInfo = {
              //型号
              model: undefined,
              //直径
              rebarDiameter: undefined,
              //品种
              rebarType: undefined,
              //数量
              gjNumber: "",
            };
          }
        }
      },
      immediate: true,
    },
  },
  mounted() {},
  methods: {
    initData() {
      let { form, row, type } = this;
      this.pageLoading = true;
      return new Promise((resolve, reject) => {
        let { id } = row;
        let { editAll, editPart } = row;
        getDetail({ id })
          .then((res) => {
            let { data } = res;
            let source = data?.result ?? {};
            let lcBeamGjInfoList = source?.lcBeamGjInfoList ?? [];
            let zlBeamGjInfo = source?.zlBeamGjInfo ?? {};
            let excludeKeys = [
              "lcBeamGjInfoList",
              "zlBeamGjInfo",
              "bridgeNameSource",
              "beamTypeSource",
              "strengthGradeSource",
              "rebarModeSource",
              "diameterSource",
              "breedSource",
            ];
            Object.keys(form).forEach((key) => {
              if (!excludeKeys.includes(key) && !key.endsWith("Disable")) {
                if (key == "strengthGrade") {
                  this.form[key] = Number(source[key]);
                } else {
                  this.form[key] = source[key];
                }
              }
            });
            if (type == 2) {
              lcBeamGjInfoList.forEach((v) => {
                v.modelDisable = true;
                v.rebarDiameterDisable = true;
                v.rebarTypeDisable = true;
                v.gjNumberDisable = true;
              });

              zlBeamGjInfo.modelDisable = true;
              zlBeamGjInfo.rebarDiameterDisable = true;
              zlBeamGjInfo.rebarTypeDisable = true;
              zlBeamGjInfo.gjNumberDisable = true;
            } else if (type == 3 && (editAll || editPart)) {
              lcBeamGjInfoList.forEach((v) => {
                v.modelDisable = false;
                v.rebarDiameterDisable = false;
                v.rebarTypeDisable = false;
                v.gjNumberDisable = false;
              });
              zlBeamGjInfo.modelDisable = false;
              zlBeamGjInfo.rebarDiameterDisable = false;
              zlBeamGjInfo.rebarTypeDisable = false;
              zlBeamGjInfo.gjNumberDisable = false;
            } else {
              lcBeamGjInfoList.forEach((v) => {
                v.modelDisable = false;
                v.rebarDiameterDisable = false;
                v.rebarTypeDisable = false;
                v.gjNumberDisable = false;
              });
              zlBeamGjInfo.modelDisable = false;
              zlBeamGjInfo.rebarDiameterDisable = false;
              zlBeamGjInfo.rebarTypeDisable = false;
              zlBeamGjInfo.gjNumberDisable = false;
            }
            if (type == 3) {
              if (lcBeamGjInfoList.length == 0) {
                lcBeamGjInfoList = [
                  {
                    //型号
                    model: undefined,
                    //直径
                    rebarDiameter: undefined,
                    //品种
                    rebarType: undefined,
                    //数量
                    gjNumber: "",
                  },
                ];
              }
            }
            this.form.lcBeamGjInfoList = lcBeamGjInfoList;
            this.form.zlBeamGjInfo = zlBeamGjInfo;
            // this.form.lcBeamGjInfoList = source?.lcBeamGjInfoList ?? [];
            resolve();
          })
          .catch((_) => {
            reject();
          })
          .finally((_) => {
            this.pageLoading = false;
          });
      });
    },

    //查询桥梁列表
    getBridgeList() {
      this.bridgeNameLoading = true;
      return new Promise((resolve, reject) => {
        getBridgeList({})
          .then((res) => {
            let { data } = res;
            this.form.bridgeNameSource = data?.result || [];
            resolve();
          })
          .catch((_) => {
            this.form.bridgeNameSource = [];
            reject();
          })
          .finally((_) => {
            this.bridgeNameLoading = false;
          });
      });
    },

    //查询梁类型
    getBeamType() {
      this.beamTypeLoading = true;
      this.queryDickey("TASK_MANAGER_TYPE", "beamTypeSource").finally((_) => {
        this.beamTypeLoading = false;
      });
    },

    //查询强度等级
    getStrength() {
      this.strengthGradeLoading = true;
      this.queryDickey("strength_grade", "strengthGradeSource").finally((_) => {
        this.strengthGradeLoading = false;
      });
    },

    //查询钢筋型号
    getRebarMode() {
      this.rebarModeLoading = true;
      this.queryDickey("gj_model", "rebarModeSource").finally((_) => {
        this.rebarModeLoading = false;
      });
    },
    //查询钢筋直径
    getDiameter() {
      this.diameterLoading = true;
      this.queryDickey("gj_diameter", "diameterSource").finally((_) => {
        this.diameterLoading = false;
      });
    },
    //查询钢筋品种
    getBreed() {
      this.breedLoading = true;
      this.queryDickey("gj_type", "breedSource").finally((_) => {
        this.breedLoading = false;
      });
    },

    //查询字典表
    queryDickey(dictKey, keyName) {
      return new Promise((resolve, reject) => {
        getDickeyList({ dictKey })
          .then((res) => {
            let { data } = res;
            this.form[keyName] = data?.result ?? [];
            resolve();
          })
          .catch((_) => {
            this.form[keyName] = [];
            reject();
          })
          .finally((_) => {});
      });
    },

    //返回
    goBack() {
      this.$refs.ruleForm.resetFields();
      this.form = {
        //梁号
        componentParts: "",
        //所属桥梁
        bridgeName: undefined,
        //联
        unite: "",
        //跨
        span: "",
        //幅别
        amClass: undefined,
        //长度
        beamLength: "",
        //梁类型
        beamType: undefined,
        //强度等级
        strengthGrade: undefined,
        //设计方量
        designVolume: "",
        //坍落度
        slump: "",
        //水泥
        cement: "",
        //细骨料
        naturalSand: "",
        //粉煤灰
        flyAsh: "",
        //水
        water: "",
        //粗骨料（5-10）
        zhongshizi: "",
        //粗骨料(10-20)
        dashizi: "",
        //外加剂
        waterReducingAgent: "",
        //钢筋信息
        lcBeamGjInfoList: [],
        //张拉钢筋信息
        zlBeamGjInfo: {},
      };
      this.$emit("update:visible", false);
    },

    getTitle(type = 0) {
      let val = Number(type);
      switch (val) {
        case 1:
          return "新增";

        case 2:
          return "查看";

        case 3:
          return "编辑";

        default:
          return "--";
      }
    },
  },
};
</script>
<style lang="less" scoped>
.beaminfo-config-container {
  box-sizing: border-box;
  height: 100%;
  padding: 10px 10px 0 10px;
  overflow: hidden;
  .beaminfo-config-body {
    width: 100%;
    height: 100%;
    background: #fff;
    .flex();
    flex-direction: column;
    overflow: hidden;
    .beaminfo-header {
      height: 46px;
      flex-shrink: 0;
      border-bottom: 1px solid #f3f4f6;
      .flex();
      color: #525a5d;
      font-size: 16px;
      align-items: center;
      padding: 0 20px;
      button {
        margin-left: auto;
      }
      &::before {
        display: flex;
        content: "";
        width: 3px;
        height: 16px;
        background: var(--primary-color);
        margin-right: 10px;
      }
    }
    .beaminfo-content {
      flex: 1;
      .custom-scrollbar();
      /deep/ .ant-collapse-content-box {
        padding: 10px 100px 0 0;
        .unionspan-container {
          .flex {
            input {
              margin: 0 4px;
              margin-top: 4px;
            }
            &:last-child {
              margin-left: 6px;
            }
          }
        }
        .rebar-col-item {
          position: relative;
          .operate-btn {
            position: absolute;
            height: 36px;
            top: 4px;
            right: -36px;
            cursor: pointer;
            .flex();
            align-items: center;
            font-size: 13px;
            .del {
              color: var(--primary-color);
            }
            .add {
              width: 22px;
              height: 22px;
              background: var(--primary-color);
              border-radius: 50%;
              .flex();
              align-items: center;
              justify-content: center;
            }
          }
        }
        .ant-form-item {
          .flex();
          .ant-input-affix-wrapper {
            width: 100%;
          }
          .ant-form-item-label {
            flex-shrink: 0;
            width: 140px;
          }
          .ant-form-item-control-wrapper {
            flex: 1;
          }
        }
      }
    }
    .beaminfo-footer {
      height: 72px;
      flex-shrink: 0;
      border-top: 1px solid #f3f4f6;
      .flex();
      align-items: center;
      justify-content: center;
    }
  }
}
</style>
